<template>
  <el-dialog v-model="isShow" align-center draggable title="编辑数据" width="60%">
    <FormCreate v-model:api="fApi" :option="options" :rule="formRules" @submit="submitData"></FormCreate>

    <div class="flex justify-end">
      <el-button type="primary" @click="submitData">提交</el-button>
    </div>
  </el-dialog>
</template>
<script lang="ts" setup>
import { nextTick, onMounted, ref } from "vue";
import formCreate from "@form-create/element-ui";
import { formGlobalOption } from "@/components/FormCreate/global";
import { EditColumns } from "@/api/interface/EditColumns";
import { SysRole } from "../columns/data";
import { GetUpdateFormRule } from "../columns/resetUpdate";
import { requestSysRoleUpdate } from "@/api/modules/sysRole";
import { ResultData } from "@/api/interface";
import { RespOk } from "@/constant/codes";
import { ElMessage } from "element-plus";
import { dtoSysRoleInfo } from "@/api/dbdto/dtoSysRole";
import UpdateColumnsData = SysRole.UpdateColumnsData;
import { ApiMenuTreeSelectList } from "@/constant/router";
import { getAuthMenuSelectListApi } from "@/api/modules/menu";

let emits = defineEmits(["reload"]);

//获取表单规则
const FormCreate = formCreate.$form(); //获取 formCreate 组件
const fApi = ref(); //文档：http://www.form-create.com/v3/instance.html
let options: any = formGlobalOption;
let formRules = ref(GetUpdateFormRule(UpdateColumnsData));
onMounted(() => {});
//提交按钮点击事件
const submitData = () => {
  let formData: dtoSysRoleInfo = fApi.value.formData() as dtoSysRoleInfo; //获取表单数据
  formData.sort = parseInt(String(formData.sort));
  formData.parent_id = parseInt(String(formData.parent_id));

  requestSysRoleUpdate(formData).then((res: ResultData<any>) => {
    if (res.code == RespOk) {
      ElMessage({ type: "success", message: "更新成功" });
      emits("reload");
      isShow.value = false;
    }
  });
};

//以下是弹窗控制相关api
let isShow = ref(false);
const ShowPop = (row: any) => {
  isShow.value = true;
  nextTick(() => {
    fApi.value.resetFields();
    fApi.value.setValue(row);
  });
};

defineExpose({ ShowPop });
</script>

<style lang="scss" scoped></style>
